<div class="orderDetail" id="orderDetail">
    <script type="text/x-dot-template" id="orderDetailTemp">
        <div class="infoTitle">订餐详情</div>
        <div class="orderPanel">
            <div class="orderHead" onclick="showDetail('orderSNXXX')">
                <div class="blackColor" style="width: 40%;float: left;">A栋B1餐厅></div>
                <div style="width: 40%;float: left;font-size: 12px;"></div>
                <div class="blackColor" style="width: 19%;float: right;text-align: right;">{{=it.orderState}}</div>
            </div>
            <div class="order-goods-list" onclick="javascript:alert(123)" style="clear: both;">
                <ul>
                    {{~it.orderItems:value:index}}
                    <li>
                        <div class="g-tit">{{=value.itemName}}</div>
                        <div class="g-pri">￥{{=value.itemPrice}}</div>
                        <div class="g-pri">×{{=value.amount}}</div>
                    </li>
                    {{~}}
                </ul>
            </div>
            <div class="orderHead">
                <div class="blackColor" style="width: 40%;float: left;">实付<span style="color: red">￥{{=it.totalPrice}}</span></div>
                <div style="float: right;">
                    {{?it.payMethod== '蓝天卡'}}
                        {{?it.orderState == '已确认'}}
                            <button  id ="cancelBtn{{=it.orderNum}}"  onclick="cancelOrder('{{=it.orderNum}}')"
                                     style="margin: 5px 0;border:0px;width:80px;height:30px;background-color:#ffc786;border-radius: 5px;color:#FCFCFC;float: right">
                                取消订单
                            </button>
                        {{??it.orderState == '已取消'}}
                            <button disabled
                                     style="margin: 5px 0;border:0px;width:80px;height:30px;background-color:#ffc786;border-radius: 5px;color:#FCFCFC;float: right">
                                已取消
                            </button>
                        {{?}}
                    {{??}}
                        {{?it.orderState == '已确认'}}
                        <button  id ="{{=it.orderNum}}"  onclick="cancelOrder('{{=it.orderNum}}')"
                                 style="margin: 5px 0;border:0px;width:80px;height:30px;background-color:#ffc786;border-radius: 5px;color:#FCFCFC;float: right">
                            取消订单
                        </button>
                        {{??it.orderState == '待退款'}}
                        <button disabled
                                style="margin: 5px 0;border:0px;width:80px;height:30px;background-color:#ffc786;border-radius: 5px;color:#FCFCFC;float: right">
                            待退款
                        </button>
                        {{?}}
                    {{?}}
                </div>

            </div>
        </div>
        <div class="infoTitle">订单信息</div>
        <div class="orderPanel">
            <table>
                <tr>
                    <td>订单号码</td>
                    <td>{{=it.orderNum}}</td>
                </tr>
                <tr>
                    <td>下单时间</td>
                    <td>{{=it.orderDate}}</td>
                </tr>
               <%-- <tr>
                    <td>预定取餐时间</td>
                    <td>19:00-21:00</td>
                </tr>--%>
                <tr>
                    <td>支付方式</td>
                    <td>{{=it.payMethod}}</td>
                </tr>
                <tr>
                    <td>备注</td>
                    <td>{{=it.memo}}</td>
                </tr>
            </table>
        </div>
    </script>
</div>
<div class="ypfood-head">
    <div class="back-div" onClick="javascript :history.back(-1);"><img
            src="/statics/imgs/head-back.png?v=${params.ver}"></div>
    <div>
        <span class="title-span">订单详情</span>
    </div>
    <div style=""></div>
</div>
<script>
    json("/order/orderDetail.jspa", {orderSn: '${param.orderSn}'}, function (data) {
        $("#orderDetail").html(doT.template($("#orderDetailTemp").html())(data));
    });
    function cancelOrder(orderSn){
        json("/order/cancelOrder.jspa", {orderSn:orderSn}, function (data) {
            if(data.code == 0){
                layer.open({content:"订单取消成功",time:3});
                setTimeout(function(){
                    window.location.reload();
                },2000)
            }else{
                layer.open({content:data.description,time:3});
            }
        });
    }
</script>